<template>
	<view>
		<u-sticky>
			<view class="dingbu">
				<view class="flexbetween" :style="{paddingTop:menutop+'rpx'}">
					<u-icon name="arrow-left" color="#fff" size="28" @click="backpage"></u-icon>
					<view class=" sanshier xiaobai fonweight textcenter">我的</view>
					<view class="" style="width: 40rpx;height: 40rpx;"></view>
				</view>
			</view>
		</u-sticky>
		<image style="height: 176rpx;width: 100%;" src="../../static/image/system/wdbpk.png" mode=""></image>
		<view class="mainpadding" style="position: relative;top: -60rpx;">
			<view class="ffffff mainpadding radius dingwei block">
				<view class="bjbtn flexcenter" v-if="is_login" @click="jumpurl('/pages/wode/bianjixx')">
					<view class="ershil xiaohei margin_right1">编辑资料</view>
					<u-icon name="arrow-right" color="#666666"></u-icon>
				</view>
				<view class="flexleft" v-if="!is_login" @click="jumpurl('/pages/login')">
					<image class="margin_right3" style="width: 128rpx;height: 128rpx;border-radius: 50%;"
						src="../../static/logo.png" mode="">
					</image>
					<view class="sanshier xiaohei fonweight">未登录,点击登录</view>
				</view>
				<view class="flexleft" v-if="is_login">
					<image class="margin_right3" style="width: 128rpx;height: 128rpx;border-radius: 50%;"
						:src="userInfo.avatar_text" mode="">
					</image>
					<view class="">
						<view class="sanshier xiaohei fonweight">{{userInfo.nickname}}</view>
						<view class="smalltext xiaohui margin_top1">手机号:{{userInfo.mobile}}</view>
					</view>
				</view>
				<view class="flexleft margin_top">
					<view class="ershil xiaohui margin_right1">青统币</view>
					<view class="sanshier xiaohei fonweight">{{userInfo.score || 0}}</view>
				</view>
				<view class="flexleft margin_top" v-if="userInfo.st">
					<view class="ershil xiaohui margin_right1">我的统战社团</view>
					<view class="xhbtn flexcenter">{{userInfo.st}}</view>
				</view>
			</view>
			<view class="margin_top xiahuaxian  mainpadding ffffff radius">
				<view class="flexbetween" @click="jumpurl('/pages/wode/shoucang')">
					<view class="flexleft">
						<image class="" style="width: 64rpx;height: 64rpx;" src="../../static/image/system/wdzx.png"
							mode=""></image>
						<view class="ershiba xiaohei">我的资讯收藏</view>
					</view>
					<u-icon name="arrow-right" color="#666666"></u-icon>
				</view>
				<!-- <view class="flexbetween margin_top">
					<view class="flexleft">
						<image class="" style="width: 64rpx;height: 64rpx;" src="../../static/image/system/wddt.png"
							mode=""></image>
						<view class="ershiba xiaohei">我的答题记录</view>
					</view>
					<u-icon name="arrow-right" color="#666666"></u-icon>
				</view> -->
				<view class="flexbetween margin_top"  @click="jumpurl('/pages/wode/huodongjl')">
					<view class="flexleft">
						<image class="" style="width: 64rpx;height: 64rpx;" src="../../static/image/system/wdhd.png"
							mode=""></image>
						<view class="ershiba xiaohei">我的活动记录</view>
					</view>
					<u-icon name="arrow-right" color="#666666"></u-icon>
				</view>
				<view class="flexbetween margin_top"  @click="jumpurl('/pages/wode/duihuanjl')">
					<view class="flexleft">
						<image class="" style="width: 64rpx;height: 64rpx;" src="../../static/image/system/wddh.png"
							mode=""></image>
						<view class="ershiba xiaohei">我的兑换记录</view>
					</view>
					<u-icon name="arrow-right" color="#666666"></u-icon>
				</view>
				<!-- <view class="flexbetween margin_top" @click="jumpurl('/pages/wode/shouhuodz')">
					<view class="flexleft">
						<image class="" style="width: 64rpx;height: 64rpx;" src="../../static/image/system/wddh.png"
							mode=""></image>
						<view class="ershiba xiaohei">我的收货地址</view>
					</view>
					<u-icon name="arrow-right" color="#666666"></u-icon>
				</view> -->
				<view class="flexbetween margin_top"  @click="jumpurlgy('/pages/wode/system?type=4')">
					<view class="flexleft">
						<image class="" style="width: 64rpx;height: 64rpx;" src="../../static/image/system/wddh.png"
							mode=""></image>
						<view class="ershiba xiaohei">关于我们</view>
					</view>
					<u-icon name="arrow-right" color="#666666"></u-icon>
				</view>
			</view>
		</view>
		<u-modal :show="show" cancelColor="#555" confirmColor="#ff9341" :showCancelButton="true" title="确定要退出当前账户么？"
			@cancel="show=false" @confirm="confirm"></u-modal>
		<view class="gudingdb mainpadding" v-if="is_login" @click="show=true">
			<view class="bigbtn">退出登录</view>
		</view>
	</view>
</template>

<script>
	const httpRequest = require("@/common/httpRequest.js")
	export default {
		data() {
			return {
				menutop: 0,
				is_login: false,
				show: false,
				userInfo: {},
				title: '确定要退出当前账户么？',
				
			}
		},
		onShareAppMessage: function(options) {
			return {
				title: '青年汇',
				imageUrl: '',
				path: '/pages/qingzixun/qingzixun'
			}
		},
		onShareTimeline: function() {
			return {
				title: '青年汇',
				imageUrl: '',
				path: '/pages/qingzixun/qingzixun'
			}
		},
		onLoad() {
			// #ifdef MP-WEIXIN
			this.menutop = uni.getMenuButtonBoundingClientRect().top * 2
			// #endif
		},
		onShow() {
			this.is_login = httpRequest.checkIsLogin();
			if (this.is_login) {
				this.init()
			} else {
				this.userInfo = null
			}
		},
		methods: {
			backpage(){
				uni.navigateBack(1)
			},
			confirm() {
				this.show = false;
				// 将存储的数据改为空达到退出登录的效果
				uni.removeStorageSync('token');
				uni.removeStorageSync('user_id');
				httpRequest.toast("退出登录成功")
				this.userInfo = null
				this.is_login = false
			},
			init() {
				httpRequest.request('/api/user/index', 'GET', {}).then(res => {
					if (res.code == 1) {
						this.userInfo = res.data
						uni.setStorageSync("invite_code", res.data.invite_code)
					} else {
						this.userInfo = null
					}

				})
			},
			jumpurl(url){
				if (!httpRequest.checkIsLogin()) {
					uni.navigateTo({
						url: "/pages/login"
					})
					return false
				}
				uni.navigateTo({
					url
				})
			},
			jumpurlgy(url){
				uni.navigateTo({
					url
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.block {
		border: 1rpx solid rgba(255, 90, 90, 0.15);
	}

	.bjbtn {
		position: absolute;
		top: 30rpx;
		right: 0;
		width: 172rpx;
		height: 54rpx;
		background: #F7F7F7;
		font-weight: 400;
		font-size: 26rpx;
		color: #333333;
		border-radius: 20rpx 0 0 20rpx;

	}

	.xhbtn {
		font-weight: 400;
		font-size: 20rpx;
		color: #FFFFFF;
		padding: 5rpx 10rpx;
		background: #FF8641;
		border-radius: 8rpx 8rpx 8rpx 8rpx;
	}

	.dingbu {
		padding: 0 30rpx 30rpx;
		background-size: 100% 100%;
		width: 100%;
		box-sizing: border-box;
		background-image: url('../../static/image/system/wdtb.png');
	}
</style>